<template>
  <div class="default-content" :style="{ width: width, height: height }">
    <slot name="content">
      <div>
        <img src="@/assets/img/empty-img-simple.svg" />
        <p class="default-title">{{ title }}</p>
      </div>
    </slot>
  </div>
</template>
<script lang="ts" setup>
  interface Props {
    width?: string
    height?: string
    title?: string
  }
  withDefaults(defineProps<Props>(), {
    width: '100%',
    height: '354px',
    title: '暂无数据'
  })
</script>
<style lang="less" scoped>
  .default-content {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 24px 32px;
    text-align: center;

    .default-title {
      margin-top: 8px;
      text-align: center;
      color: @text04;
      .font14();
    }
  }
</style>
